<template>
	<view class="product-con" :style="{marginTop:navH+'rpx'}">
		<view class='navbar' :style="{height:navH+'rpx'}">
			<view class='navbarH' :style='"height:"+navH+"rpx;"'>
				<view class='navbarCon acea-row row-center-wrapper'>
					<view class="header acea-row row-center-wrapper">
						<view class="item" :class="navActive === index ? 'on' : ''" v-for="(item,index) in navList"
							:key='index' @tap="tap(index)">{{ item }}</view>
					</view>
				</view>
			</view>
		</view>
		<view class='iconfont iconfanhui' :style="'top:'+navH/2+'rpx'" @tap='returns'></view>
		<!-- B端 -->
		<view v-if="systemType">
			<scroll-view :scroll-into-view="toView" scroll-y='true' scroll-with-animation="true" :style='"height:"+(height-(navH/2))+"px;"' @scroll="scroll">
				<view id="past0">
					<productConSwiper :imgUrls="sliderImage" :videoline="storeInfo.videoLink"></productConSwiper>
					<view class="shengdanWarp" v-if="isShengDan" @click="isGuize = true">
						<view class="lefts">
							<text class="h1">圣诞礼遇</text>
							<text class="h2">&euro;1</text>
							<text class="h3" v-if="appletType==1">{{$util.ipMoney(storeInfo.price).type + ($util.ipMoney(storeInfo.price).num+$util.ipMoney(storeInfo.taxAndSecondPrice).num)}}</text>
							<text class="h3" v-else>{{$util.ipMoney(storeInfo.price).type + $util.ipMoney(storeInfo.price).num}}</text>
						</view>
						<view class="rights">
							<text class="h1">结束时间</text>
							<text class="h2">12-25 23:59</text>
							<text class="h3 iconfont iconarrow-right1"></text>
						</view>
					</view>
					<view class='wrapper'>
						<view class='share acea-row row-between row-bottom'>
							<view class='titWarp'>
								<view class="h1">{{storeInfo.brandName}}</view>
								<view class="h2" @click="copyWeiXin(storeInfo.keyword)">
									{{storeInfo.storeName + " " + storeInfo.keyword}}</view>
							</view>
							<!-- <view style="display: flex;">
								<view @click="setCollect">
									<view class='iconfont iconshoucang-tianchong' v-if="storeInfo.userCollect"></view>
									<view class='iconfont iconshoucang' v-else></view>
								</view>
								<view class='iconfont iconfenxiang' style="margin-left: 20rpx;"
									@click="listenerActionSheet"></view>
							</view> -->
						</view>
						<view class='moneyWarp'>
							<view style="margin: 40rpx 0;overflow: hidden;" v-if="pricePriority">
								<view style="font-size: 24rpx;color: #101010;margin: 10rpx 0;display: flex;justify-content: space-between;">
									<view style="padding:8rpx 10rpx;background-color: #E4D3B7;">价格最低</view>
									<view></view>
								</view>
								<view class="l-content">
									<view class="content-left">
										<view class="h1Warp">
											<text class="h1" v-if="!isShengDanOK">
												<block v-if="appletType==1">{{$util.ipMoney(pricePriority.storeInfo.price).type + ($util.ipMoney(pricePriority.storeInfo.price).num + $util.ipMoney(pricePriority.storeInfo.taxAndSecondPrice).num)}}</block>
												<block v-else>{{$util.ipMoney(pricePriority.storeInfo.price).type + $util.ipMoney(pricePriority.storeInfo.price).num}}</block>
											</text>
											<text class="h1" v-if="isShengDanOK">&euro;1</text>
											<view class="taxPrice" v-if="appletType==0">+{{pricePriority.storeInfo.taxAndSecondPrice}}<text class="t1">(运税费)</text></view>
										</view>
										<!-- v-if="pricePriority.storeInfo.otPrice && pricePriority.storeInfo.otPrice>0 && (pricePriority.storeInfo.price < (pricePriority.storeInfo.otPrice * 8)) -->
										<view class="h2"
											v-if="pricePriority.storeInfo.otPrice && pricePriority.storeInfo.otPrice>0">
											<text class="discount"
												v-if="pricePriority.storeInfo.discount">{{pricePriority.storeInfo.discount}}</text>
											<text class='ouyuan'>&euro;{{pricePriority.storeInfo.otPrice}}</text>
										</view>
									</view>
									<view>
										<form @submit="selecAttr(pricePriority)" report-submit='true'>
											<button class='joinCart bnts buyButton' form-type="submit">立即购买</button>
										</form>
									</view>
								</view>
								<view class="h1Warp" style="margin-top: 10rpx;">
									<view class="fahuoLabel">
										<image :src="`../../static/images/${option.site}.png`" v-if="pricePriority.storeInfo.tempId == option.id" class="shipadd" 
										:class="option.site" v-for="(option,optionIndex) in iconList" :key="optionIndex"></image>
										<text>{{pricePriority.storeInfo.stockAreaName}}</text>
									</view>
									<view class="deliveryTime">
										{{pricePriority.storeInfo.deliveryTime?pricePriority.storeInfo.deliveryTime+' , ':''}}{{pricePriority.storeInfo.receivingTime?pricePriority.storeInfo.receivingTime:''}}
									</view>
								</view>
								<view class="productWinList">
									<view class="item">
										<view class="listn acea-row row-middle">
											<view class="itemn" v-for="(itemO, indexw) in pricePriority.productValue" :key="indexw">{{itemO.spc}}/{{itemO.stock}}{{pricePriority.storeInfo.unitName}}</view>
										</view>
									</view>
								</view>
							</view>
							<view style="margin: 40rpx 0;overflow: hidden;" v-if="speedPriority">
								<view style="font-size: 24rpx;color: #101010;margin: 10rpx 0;display: flex;justify-content: space-between;">
									<view style="padding:8rpx 10rpx;background-color: #E4D3B7;">物流最快</view>
									<view></view>
								</view>
								<view class="l-content">
									<view class="content-left">
										<view class="h1Warp">
											<text class="h1" v-if="!isShengDanOK">
												<block v-if="appletType==1">{{$util.ipMoney(speedPriority.storeInfo.price).type + ($util.ipMoney(speedPriority.storeInfo.price).num+$util.ipMoney(speedPriority.storeInfo.taxAndSecondPrice).num)}}</block>
												<block v-else>{{$util.ipMoney(speedPriority.storeInfo.price).type + $util.ipMoney(speedPriority.storeInfo.price).num}}</block>
											</text>
											<text class="h1" v-if="isShengDanOK">&euro;1</text>
											<view class="taxPrice" v>+{{speedPriority.storeInfo.taxAndSecondPrice}}<text class="t1">(运税费)</text></view>
										</view>
										<view class="h2" v-if="speedPriority.storeInfo.otPrice && speedPriority.storeInfo.otPrice>0">
											<text class="discount"
												v-if="speedPriority.storeInfo.discount">{{speedPriority.storeInfo.discount}}</text>
											<text class='ouyuan'>&euro;{{speedPriority.storeInfo.otPrice}}</text>
										</view>
									</view>
									<view>
										<form @submit="selecAttr(speedPriority)" report-submit='true'>
											<button class='joinCart bnts buyButton' form-type="submit">立即购买</button>
										</form>
									</view>
								</view>
								<view class="h1Warp" style="margin-top: 10rpx;">
									<view class="fahuoLabel">
										<image :src="`../../static/images/${option.site}.png`" v-if="speedPriority.storeInfo.tempId == option.id" class="shipadd"
										:class="option.site" v-for="(option,optionIndex) in iconList" :key="optionIndex"></image>
										<text>{{speedPriority.storeInfo.stockAreaName}}</text>
									</view>
									<view class="deliveryTime">
										{{speedPriority.storeInfo.deliveryTime?speedPriority.storeInfo.deliveryTime+' , ':''}} {{speedPriority.storeInfo.receivingTime?speedPriority.storeInfo.receivingTime:''}}
									</view>
								</view>
								<view class="productWinList">
									<view class="item">
										<view class="listn acea-row row-middle">
											<view class="itemn" v-for="(itemO, indexw) in speedPriority.productValue" :key="indexw">{{itemO.spc}}/{{itemO.stock}}{{pricePriority.storeInfo.unitName}}</view>
										</view>
									</view>
								</view>
							</view>
							
							<block v-for="(item,index) in storeDetail.products" :key="index">
								<view style="margin: 40rpx 0;overflow: hidden;">
									<view class="l-content">
										<view class="content-left">
											<view class="h1Warp">
												<text class="h1"
													v-if="!isShengDanOK">{{$util.ipMoney(item.storeInfo.price).type + $util.ipMoney(item.storeInfo.price).num}}</text>
												<text class="h1" v-if="isShengDanOK">&euro;1</text>
												<view class="taxPrice">+{{item.storeInfo.taxAndSecondPrice}}<text
														class="t1">(运税费)</text></view>
											</view>
											<view class="h2"
												v-if="item.storeInfo.otPrice && item.storeInfo.otPrice>0">
												<text class="discount"
													v-if="item.storeInfo.discount">{{item.storeInfo.discount}}</text>
												<text class='ouyuan'>&euro;{{item.storeInfo.otPrice}}</text>
											</view>
										</view>
										<view>
											<form @submit="selecAttr(item)" report-submit='true'>
												<button class='joinCart bnts buyButton' form-type="submit">立即购买</button>
											</form>
										</view>
									</view>
									<view class="h1Warp" style="margin-top: 10rpx;">
										<view class="fahuoLabel">
											<image :src="`../../static/images/${option.site}.png`" v-if="item.storeInfo.tempId == option.id" class="shipadd"
											:class="option.site" v-for="(option,optionIndex) in iconList" :key="optionIndex"></image>
											<text>{{item.storeInfo.stockAreaName}}</text>
										</view>
										<view class="deliveryTime">
											{{item.storeInfo.deliveryTime?item.storeInfo.deliveryTime+' , ':''}} {{item.storeInfo.receivingTime?item.storeInfo.receivingTime:''}}
										</view>
									</view>
									<view class="productWinList">
										<view class="item">
											<view class="listn acea-row row-middle">
												<view class="itemn" v-for="(itemO, indexw) in item.productValue" :key="indexw">{{itemO.spc}}/{{itemO.stock}}{{pricePriority.storeInfo.unitName}}</view>
											</view>
										</view>
									</view>
								</view>
							</block>
						</view>
					</view>
					<!-- <view class='attribute acea-row row-between-wrapper' @click="selecAttr" v-if="productValue && JSON.stringify(productValue)!='{}' && productAttr && productAttr.length !=0 && storeInfo.stock > 0 && storeInfo.isShow">
						<view>
							<text>{{attrTxt}}：</text>
							<text class='atterTxt'>{{attrValue}}</text>
						</view>
						<view class='iconfont iconarrow-right1'></view>
					</view> -->
				</view>
				<!-- <view class='userEvaluation' id="past1">
					<view class='title acea-row row-between-wrapper'>
						<view>用户评价({{replyCount}})</view>
						<navigator class='praise' hover-class='none' :url='"/pages/goods_comment_list/index?product_id="+id'>
							<text class='font-color' v-if="replyChance>0">{{replyChance}}%</text>好评率
							<text class='iconfont iconarrow-right1'></text>
						</navigator>
					</view>
					<block v-if="replyCount">
						<userEvaluation :reply="reply"></userEvaluation>
					</block>
				</view> -->
				<view class="product-intro">
					<view class='title'>商品信息</view>
					<view class="conter" style="background-color: #FFFFFF;padding: 10rpx 30rpx;">
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">商品描述</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">{{storeInfo.storeInfo}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">品牌</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">{{storeInfo.brandName}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">规格</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.dimension?storeInfo.dimension:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">成分</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.composition?storeInfo.composition:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">色号</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.colorCode?storeInfo.colorCode:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">季节</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.seasonCode?storeInfo.seasonCode:''}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
				</view>
				<view class='product-intro' v-if="storeDetail.channelMerchant.storeImage">
					<view class='title'>店铺信息</view>
					<view class='conter'>
						<image mode="widthFix" :src="storeDetail.channelMerchant.storeImage"></image>
					</view>
				</view>
				<view class='product-intro' id="past1">
					<view class='title'>商品介绍</view>
					<view class='conter'>
						<block v-for="(item,index) in sliderImage" :key='index'>
							<image mode="widthFix" :src="item"></image>
						</block>
					</view>
				</view>
				<view class='product-intro' id="past2" v-if="storeDetail.channelMerchant.logisticsImage">
					<view class='title'>购物须知</view>
					<view class='conter'>
						<image mode="widthFix" :src="storeDetail.channelMerchant.logisticsImage"></image>
					</view>
				</view>
				<view :style='[{ height:bottomLift==0?"120rpx" : "184rpx"}]'></view>
			</scroll-view>
		</view>
		<!-- B端 -->
		<!-- C端 -->
		<view v-else>
			<scroll-view :scroll-into-view="toView" scroll-y='true' scroll-with-animation="true" :style='"height:"+(height-(navH/2))+"px;"' @scroll="scroll">
				<view id="past0" class="u-skeleton">
					<view class="u-skeleton-rect" style="width: 750rpx;height: 750rpx;">
						<productConSwiper :imgUrls="sliderImage" :videoline="storeInfo.videoLink"></productConSwiper>
					</view>
					
					<view class="shengdanWarp" v-if="isShengDan" @click="isGuize = true">
						<view class="lefts">
							<text class="h1">圣诞礼遇</text>
							<text class="h2">&euro;1</text>
							<text class="h3" v-if="appletType==1">{{$util.ipMoney(storeInfo.price).type + ($util.ipMoney(storeInfo.price).num+$util.ipMoney(storeInfo.taxAndSecondPrice).num)}}</text>
							<text class="h3" v-else>{{$util.ipMoney(storeInfo.price).type + $util.ipMoney(storeInfo.price).num}}</text>
						</view>
						<view class="rights">
							<text class="h1">结束时间</text>
							<text class="h2">12-25 23:59</text>
							<text class="h3 iconfont iconarrow-right1"></text>
						</view>
					</view>
					<view class='wrapper'>
						<view class='share acea-row row-between row-bottom'>
							<view class='titWarp'>
								<view class="h1 u-skeleton-rect">{{storeInfo.brandName}}</view>
								<view class="h2 u-skeleton-rect" @click="copyWeiXin(storeInfo.keyword)">{{storeInfo.storeName + " " + storeInfo.keyword}}</view>
							</view>
							<view class='iconfont iconfenxiang' @click="listenerActionSheet"></view>
						</view>
						<view class='moneyWarp'>
							<view class="h1Warp">
								<text class="h1 u-skeleton-rect" v-if="!isShengDanOK">
									<block v-if="appletType==1">{{$util.ipMoney(storeInfo.price).type + ($util.ipMoney(storeInfo.price).num + $util.ipMoney(storeInfo.taxAndSecondPrice).num)}}</block>
									<block v-else>{{$util.ipMoney(storeInfo.price).type + $util.ipMoney(storeInfo.price).num}}</block>
								</text>
								<text class="h1 u-skeleton-rect" v-if="isShengDanOK">&euro;1</text>
								<view class="taxPrice u-skeleton-rect" v-if="appletType==0">+{{storeInfo.taxAndSecondPrice}}<text class="t1">(运税费)</text></view>
							</view>
							<view class="u-skeleton-rect" style="width: 100%;height: 38rpx;">
								<view class="h2" v-if="storeInfo.otPrice && storeInfo.otPrice>0">
									<text class="discount" v-if="storeInfo.discount&&operation(storeInfo.discount)<10">{{storeInfo.discount}}</text>
									<!-- <text class='ouyuan'>￥{{storeInfo.otPrice*8}}</text> -->
									<!-- <text style="margin:0 10rpx">/</text> -->
									<block v-if="appletType==1&&operation(storeInfo.discount)<10">
										<text class='ouyuan'>&euro;{{storeInfo.otPrice}}</text>
									</block>
									<block v-if="appletType==0">
										<text class='ouyuan'>&euro;{{storeInfo.otPrice}}</text>
									</block>
									
								</view>
							</view>
							
							<view class="h1Warp u-skeleton-rect" style="margin-top: 10rpx;">
								<view class="fahuoLabel">
									<image :src="`../../static/images/${option.site}.png`"  v-if="storeInfo.tempId == option.id" class="shipadd" :class="option.site" v-for="(option,optionIndex) in iconList" :key="optionIndex"></image>
									<text>{{storeInfo.stockAreaName}}</text>
								</view>
								<view class="deliveryTime">
									{{storeInfo.deliveryTime?storeInfo.deliveryTime+' , ':''}} {{storeInfo.receivingTime?storeInfo.receivingTime:''}}
								</view>
							</view>
						</view>
					</view>
					<view class='attribute acea-row row-between-wrapper' @click="selecAttr1" v-if="productValue && JSON.stringify(productValue)!='{}' && productAttr && productAttr.length !=0 && storeInfo.stock > 0 && storeInfo.isShow">
						<view>
							<text>{{attrTxt}}：</text>
							<text class='atterTxt'>{{attrValue}}</text>
						</view>
						<view class='iconfont iconarrow-right1'></view>
					</view>
				</view>
				<!-- <view class='userEvaluation' id="past1">
					<view class='title acea-row row-between-wrapper'>
						<view>用户评价({{replyCount}})</view>
						<navigator class='praise' hover-class='none' :url='"/pages/goods_comment_list/index?product_id="+id'>
							<text class='font-color' v-if="replyChance>0">{{replyChance}}%</text>好评率
							<text class='iconfont iconarrow-right1'></text>
						</navigator>
					</view>
					<block v-if="replyCount">
						<userEvaluation :reply="reply"></userEvaluation>
					</block>
				</view> -->
				<view class="product-intro">
					<view class='title'>商品信息</view>
					<view class="conter" style="background-color: #FFFFFF;padding: 10rpx 30rpx;">
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">商品描述</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">{{storeDetail.storeInfo.storeInfo}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">品牌</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">{{storeDetail.storeInfo.brandName}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">规格</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeDetail.storeInfo.dimension?storeDetail.storeInfo.dimension:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">成分</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeDetail.storeInfo.composition?storeDetail.storeInfo.composition:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">色号</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.colorCode?storeInfo.colorCode:''}}</view>
								</u-col>
							</u-row>
						</view>
						<view class="goodsInfo-row">
							<u-row gutter="16" justify="center">
								<u-col span="2">
									<view class="demo-layout bg-purple">季节</view>
								</u-col>
								<u-col span="10">
									<view class="demo-layout bg-purple-light">
										{{storeInfo.seasonCode?storeInfo.seasonCode:''}}</view>
								</u-col>
							</u-row>
						</view>
					</view>
				</view>
				<view class='product-intro' v-if="storeDetail.channelMerchant.storeImage">
					<view class='title'>店铺信息</view>
					<view class='conter'>
						<image mode="widthFix" :src="storeDetail.channelMerchant.storeImage"></image>
					</view>
				</view>
				<view class='product-intro' id="past1">
					<view class='title'>商品介绍</view>
					<view class='conter'>
						<block v-for="(item,index) in sliderImage" :key='index'>
							 <image mode="widthFix" :src="item" ></image>
						</block>
					</view>
				</view>
				<view class='product-intro' id="past2" v-if="storeDetail.channelMerchant.logisticsImage">
					<view class='title'>购物须知</view>
					<view class='conter'>
						<image mode="widthFix" :src="storeDetail.channelMerchant.logisticsImage"></image>
					</view>
				</view>
				<view :style='[{ height:bottomLift==0?"120rpx" : `${bottomLift+120}rpx`}]'></view>
			</scroll-view>
		</view>
		<!-- C端 -->
		<!-- 购买弹窗 -->
		<productWindow ref="gouwuche" @showWx='showWxFun' :systemType="systemType" :storeData="JSON.stringify(storeData)" :senceType="2"
			:attrValue.sync="attrValue" :attrTxt.sync="attrTxt" id='product-window' @cartAttr="cartAttrFun"></productWindow>
		<!-- 分享按钮 -->
		<view class="generate-posters acea-row row-middle" :class="posters ? 'on' : ''">
			<button class="item" open-type="share" hover-class='none' @click="closePosters">
				<view class="iconfont iconweixin"></view>
				<view class="">发送给朋友</view>
			</button>
			<button class="item" hover-class='none' @click="goPoster">
				<view class="iconfont icontupian"></view>
				<view class="">生成海报</view>
			</button>
		</view>
		<view class="mask" v-if="posters" @click="closePosters"></view>
		<view class="mask" v-if="canvasStatus" @click="listenerActionClose"></view>

		<!-- 海报展示 -->
		<view class='poster-pop' v-if="canvasStatus">
			<image src='../../static/images/poster-close.png' class='close' @click="posterImageClose"></image>
			<image :src='imagePath'></image>
			<!-- #ifndef H5  -->
			<view class='save-poster' @click="savePosterPath">保存到手机</view>
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view class="keep">长按图片可以保存到手机</view>
			<!-- #endif -->
		</view>
		<view class="canvas" v-show="canvasContext">
			<canvas style="width:750px;height:1190px;" canvas-id="firstCanvas"></canvas>
			<canvas canvas-id="qrcode" :style="{width: `${qrcodeSize}px`, height: `${qrcodeSize}px`}" />
		</view>

		<!-- 规则弹框 -->
		<view class="guizeMask" v-if="isGuize" @click="isGuize = false">
			<view class="guizeCon" @click.stop>
				<view class="iconfont iconguanbi1" @click="isGuize = false"></view>
				<view class="title">活动规则</view>
				<view class="h1">1.活动时间：2020年12月24-12月25</view>
				<view class="h1">2.通过分享邀请注册用户满10人，即可享受1欧元购买指定商品，限购1件。</view>
			</view>
		</view>

		<!-- 微信名片 -->
		<view class="wx_card" @click="showWxService = false" v-if="showWxService">
			<view class="wx_code" @click.stop>
				<span @click="showWxService = false" class="iconfont iconguanbi1"></span>
				<view class="code_er">
					<image :src="wxCode" mode="" show-menu-by-longpress></image>
				</view>
				<view class="add_tips">添加微信，联系您的客户经理</view>
			</view>
		</view>
		
		<u-skeleton :loading="loading" :animation="true" el-color="#EFEFEF" bgColor="#fff"></u-skeleton>
	</view>
</template>

<script>
	import {
		mapGetters
	} from "vuex";
	import {
		getProductDetail,
		getOneProductDetail,
		getReplyList,
		getReplyConfig
	} from '@/api/store.js';
	import {
		getShare,
		imageBase64,
	} from '@/api/public.js';
	import {
		getIndexData,
		getQrcode
	} from '@/api/api.js';
	import {
		collectAdd,
		collectDel,
		postCartAdd,
	} from '@/api/store.js';
	import productConSwiper from '@/components/productConSwiper';
	import userEvaluation from '@/components/userEvaluation';
	import productWindow from '@/components/productWindowNew';
	let app = getApp();
	export default {
		components: {
			productConSwiper,
			userEvaluation,
			productWindow,
		},
		data() {
			let that = this;
			return {
				configApi: {}, //分享类容配置
				retunTop: true, //顶部返回
				navH: "", //导航高度
				// opacity: 0, //导航透明度
				navActive: 0, //导航选中
				navList: ['商品', '详情', '购物须知'], //导航内容
				toView: '', //导航关联的内容
				lock: false, //滑动锁定
				scrollTop: 0, //距离顶部的高度
				scrollTop1:0,
				scrollY: 0, //滚动高度
				topArr: [], //导航关联内容距离顶部的高度
				heightArr: [],
				height: 0, //整个窗口高度

				id: 0, //商品id
				sliderImage: [], //商品轮播图
				storeInfo: {
					brandName:'模拟数据',
					storeName:'模拟数据',
					keyword:'模拟数据',
					taxAndSecondPrice:'模拟数据',
					discount:'模拟数据',
					otPrice:'模拟数据',
					stockAreaName:'模拟数据',
					deliveryTime:'模拟数据',
					receivingTime:'模拟数据',
				}, //商品详情
				storeData: {}, //选购商品详情
				storeDetail: {}, //商品详情
				productValue: {}, //系统属性
				productAttr: [],
				posters: false, //分享弹框开关
				replyCount: 0, //总评论数量
				reply: [], //评论列表
				replyChance: 0, //好评率
				attrTxt: '请选择', //属性页面提示
				attrValue: '', //已选属性

				canvasStatus: false, //是否显示海报
				imagePath: '', //海报路径
				qrcodeSize: 600,
				imgTop: '',
				PromotionCode: '', //二维码图片
				posterbackgd: '/static/images/posterbackgd.png',

				isGuize: false,
				isShengDan: false,
				isShengDanOK: false,

				isJiaZaiOk: false,

				canvasContext: false,
				showWxService: false, // 客服显示弹出框

				wxCode: app.globalData.wxCode,
				pricePriority:'',
				speedPriority:'',
				systemType: true,
				cartAttr:false,  // 购物车是否弹出
				bottomLift:app.globalData.bottomLift,
				appletType:uni.getStorageSync("appletType"),
				
				loading:true
			};
		},
		computed: mapGetters(['isLogin', 'uid','iconList']),
		onLoad(options) {
			console.log(options, "options")
			let that = this
			var pages = getCurrentPages();
			if (pages.length <= 1) {
				that.retunTop = false
			}
			// #ifdef MP
			this.navH = app.globalData.navHeight;
			// #endif
			// #ifndef MP
			this.navH = 96;
			// #endif
			uni.getSystemInfo({
				success: function(res) {
					that.height = res.windowHeight
					//res.windowHeight:获取整个窗口高度为px，*2为rpx；98为头部占据的高度；
				},
			});
			//扫码携带参数处理
			// #ifdef MP
			if (options.scene) {
				let value = this.$util.getUrlParams(decodeURIComponent(options.scene));
				if (value.id) options.id = value.id;
				//记录推广人uid
				if (value.pid) app.globalData.spid = value.pid;
			}
			if (!options.id) {
				return this.$util.Tips({
					title: '缺少参数无法查看商品'
				}, {
					tab: 3,
					url: 1
				});
			} else {
				this.id = options.id
			}
			//记录推广人uid
			if (options.spid) app.globalData.spid = options.spid;
			// #endif

			if (options.isShengDan) {
				this.isShengDan = true
			}
			uni.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			})
		},
		onReady() {},
		onShow() {
			var that = this;
			var productDetailConfig = uni.getStorageSync("productDetailConfig")
			this.systemType = productDetailConfig==0?true:false
			that.getProductReplyList();
			that.getProductReplyCount();
			that.shareApi();		
			that.$refs.gouwuche.getCartCount()
			this.getGoodsDetails();
			that.$refs.gouwuche.isShowFooterBtn = true
			that.$refs.gouwuche.sceneType = 2
			
		},
		methods: {
			// 后退
			returns: function() {
				var pages = getCurrentPages()
				console.log(pages)
				if (pages.length == 1) {
					uni.switchTab({
						url: "/pages/index/index"
					})
				} else {
					uni.navigateBack()
				}
			},
			// 导航切换
			tap: function(index) {
				var id = "past" + index;
				var index = index;
				var that = this;
				this.$set(this, 'toView', id);
				this.$set(this, 'navActive', index);
				this.$set(this, 'lock', true);
				// this.$set(this, 'scrollTop', index > 0 ? that.topArr[index] - (app.globalData.navHeight / 2) : that.topArr[index]);
				console.info(that.topArr[index])
			},
			// 获取产品详情
			getGoodsDetails: function() {
				let that = this;
				uni.showLoading({
					title: "加载中"
				})
				if(that.systemType===false) {
					getOneProductDetail(that.id).then(res => {
						uni.hideLoading()
						let navList = ['商品',"详情"]
						// if(res.data.channelMerchant.storeImage){
						// 	 navList.unshift('详情')
						// }
						if (res.data.channelMerchant.logisticsImage){
							navList.push('购物须知')
						}
						
						that.navList = navList
						let storeInfo = res.data.storeInfo;
						let storeData = res.data;
						that.storeDetail = res.data
						// 字符串数组转数组；
						let sliderImage = JSON.parse(storeInfo.sliderImage);
						that.$set(that, 'sliderImage', sliderImage);
						that.$set(that, 'storeInfo', storeInfo);
						that.$set(that, 'storeData', storeData);
						that.$set(that, 'productAttr', res.data.productAttr);
						that.$set(that, 'productValue', res.data.productValues);
						var aa = Object.assign({}, res.data.productValues)
						// uni.setNavigationBarTitle({
						// 	title: storeInfo.storeName.substring(0, 7) + "..."
						// })
						let productAttr = this.storeData.productAttr;
						let value = [];
						for (let key in this.productValues) {
							if (this.productValues[key].stock > 0) {
								value = this.storeData.productAttr.length ? key.split(",") : [];
								break;
							}
						}
						for (let i = 0; i < productAttr.length; i++) {
							this.$set(productAttr[i], "index", value[i]);
						}
						// #ifdef MP-WEIXIN
						setTimeout(function() {
							that.infoScroll();
						}, 500);
						// #endif
						that.loading = false
						that.isJiaZaiOk = true
					})
				} else {
					getProductDetail(that.id).then(res => {
						uni.hideLoading()
						let navList = ['商品',"详情"]
						// if(res.data.channelMerchant.storeImage){
						// 	navList.unshift('详情')
						// }
						if (res.data.channelMerchant.logisticsImage){
							navList.push('购物须知')
						}
						that.navList = navList
						let storeInfo = res.data.productNorm;
						let storeData = res.data.products?res.data.products[0]:[];
						that.storeDetail = res.data
						that.$nextTick(()=>{
							var contentData = res.data.products
							contentData.map(i=>{
								for(let j in i.productValue){
									var arry = j.split(',')
									if(arry.length>1){
										i.productValue[j].spc= arry[1]
									}else{
										i.productValue[j].spc= j
									}
									console.info(j.split(','))
								}
							})
							var arr = contentData
							let arr1 = contentData
							var compare = function (obj1, obj2) {
							    var val1 = obj1.storeInfo.price;
							    var val2 = obj2.storeInfo.price;
							    if (val1 < val2) {
							        return -1;
							    } else if (val1 > val2) {
							        return 1;
							    } else {
							        return 0;
							    }            
							}
							var pricePriority = arr.sort(compare)
							that.pricePriority= pricePriority[0]
							pricePriority.splice(0,1);
							if(pricePriority.length>0){
								let compare1 = function (obj1, obj2) {
								    let val1 = obj1.storeInfo.tempId;
								    let val2 = obj2.storeInfo.tempId;
								    if (val1 < val2) {
								        return -1;
								    } else if (val1 > val2) {
								        return 1;
								    } else {
								        return 0;
								    }            
								}
								let speedPriority = pricePriority.sort(compare1)
								that.speedPriority = speedPriority[0]
							}
							
							
							var array = []
							for(let i of res.data.products){
								if (that.pricePriority&&that.pricePriority.storeInfo.id===i.storeInfo.id) {
									
								}else if(that.speedPriority&&that.speedPriority.storeInfo.id===i.storeInfo.id){
									
								}else{
									array.push(i)
								}
							}
							that.storeDetail.products = array
							console.info(that.storeDetail,"啊啊所多")
						})
						
						// 字符串数组转数组；
						let sliderImage = JSON.parse(storeInfo.sliderImage);
						that.$set(that, 'sliderImage', sliderImage);
						that.$set(that, 'storeInfo', storeInfo);
						that.$set(that, 'storeData', storeData);
						that.$set(that, 'productAttr', res.data.productAttr);
						that.$set(that, 'productValue', res.data.productValue);
						var aa = Object.assign({}, res.data.productValue)
						console.info(aa, 'storeData')
						// uni.setNavigationBarTitle({
						// 	title: storeInfo.storeName.substring(0, 7) + "..."
						// })
						let productAttr = this.storeData.productAttr;
						let value = [];
						for (let key in this.productValue) {
							if (this.productValue[key].stock > 0) {
								value = this.storeData.productAttr.length ? key.split(",") : [];
								break;
							}
						}
						for (let i = 0; i < productAttr.length; i++) {
							this.$set(productAttr[i], "index", value[i]);
						}
						// #ifdef MP-WEIXIN
						setTimeout(function() {
							that.infoScroll();
						}, 500);
						// #endif
						that.loading = false
						that.isJiaZaiOk = true
					}).catch(err => {
						uni.hideLoading()
						that.isJiaZaiOk = true
						//状态异常返回上级页面
						return that.$util.Tips({
							title: err.toString()
						}, {
							tab: 3,
							url: 1
						});
					})
				}		
			},
			//获取分享数据
			shareApi: function() {
				getShare().then(res => {
					this.$set(this, 'configApi', res.data);
				})
			},
			//获取用户评价
			getProductReplyList: function() {
				getReplyList(this.id, {
					page: 1,
					limit: 3,
					type: 0,
				}).then(res => {
					this.reply = res.data.list;
				})
			},
			//获取用户评价数量
			getProductReplyCount: function() {
				let that = this;
				getReplyConfig(that.id).then(res => {
					that.$set(that, 'replyChance', res.data.replyChance * 100);
					that.$set(that, 'replyCount', res.data.sumCount);
				});
			},
			// 页面滚动元素高度信息
			infoScroll: function() {
				var that = this,
					topArr = [],
					heightArr = [];
				for (let i = 0; i < that.navList.length; i++) {
					//获取元素所在位置
					var query = uni.createSelectorQuery().in(this);
					var idView = "#past" + i;
					query.select(idView).boundingClientRect();
					query.exec(function(res) {
						var top = res[0].top;
						var height = res[0].height;
						topArr.push(top);
						heightArr.push(height);
						that.$set(that, 'topArr', topArr);
						that.$set(that, 'heightArr', heightArr);
					});
				};
			},
			//页面滚动事件
			scroll: function(e) {
				var that = this,
					scrollY = e.detail.scrollTop;
				var opacity = scrollY / 200;
				// opacity = opacity > 1 ? 1 : opacity;
				// that.$set(that, 'opacity', opacity);
				// that.$set(that, 'scrollTop', scrollY);
				if (that.lock) {
					that.$set(that, 'lock', false)
					return;
				}
				for (var i = 0; i < that.topArr.length; i++) {
					if (scrollY < that.topArr[i] - (app.globalData.navHeight / 2) + that.heightArr[i]) {
						that.$set(that, 'navActive', i)
						break
					}
				}
			},
			// 复制文本功能
			copyWeiXin(val) {
				var that = this
				// #ifdef H5
				that.$copyText(val).then(e => {
					that.showWx = false
					uni.showToast({
						title: '复制成功',
						icon: "none",
						duration: 1000
					})
				}, e => {
					uni.showToast({
						title: '复制失败',
						icon: "none",
						duration: 1000
					})
				})
				// #endif
				// #ifndef H5
				uni.setClipboardData({
					data: val,
					success: function() {
						that.showWx = false
					}
				});
				// #endif
			},
			// 分享打开
			listenerActionSheet: function() {
				if (this.isLogin === false) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					this.posters = true;
				}
			},
			// 分享关闭
			closePosters: function() {
				this.posters = false;
			},
			// 打开购物车组件
			selecAttr: function(item) {
				var that = this
				this.storeData = item
				console.info(this.storeData,"itemaaaaaaaaaaaaaaaaaaaaaaaaa")
				that.$refs.gouwuche.attr.cartAttr = true
			},
			selecAttr1(){
				var that = this
				that.$refs.gouwuche.attr.cartAttr = true
			},
			/**
			 * 生成海报
			 */
			goPoster: function() {
				let that = this;
				that.canvasContext = true
				that.posters = false;
				uni.showLoading({
					title: '海报生成中',
					mask: true
				});
				imageBase64({
					url: that.storeInfo.image
				}).then(res => {
					that.imgTop = res.data.code
					// #ifdef MP
					let data = {
						pid: that.uid,
						id: that.id,
						path: 'pages/goods_details/index'
					}
					getQrcode(data).then(res => {
						that.PromotionCode = res.data.code;
						let arrImages = [that.posterbackgd, that.imgTop, that.PromotionCode];
						let storeName = that.storeInfo.storeName;
						let price = that.appletType==1?that.$util.ipMoney(that.storeInfo.price).num + that.$util.ipMoney(that.storeInfo.taxAndSecondPrice).num : that.storeInfo.price
						console.info(price)
						that.PosterCanvas(arrImages, storeName, price, function(tempFilePath) {
							that.imagePath = tempFilePath;
							that.canvasStatus = true;
						});
					})
					// #endif
					// #ifndef MP
					let arrImages = [that.posterbackgd, that.imgTop, that.PromotionCode];
					let storeName = that.storeInfo.storeName;
					let price = that.storeInfo.price;
					that.PosterCanvas(arrImages, storeName, price, function(tempFilePath) {
						that.imagePath = tempFilePath;
						that.canvasStatus = true;
					});
					// #endif
				}).catch(err => {
					uni.showToast({
						title: '无法获取图片信息',
						icon: "none"
					})
				})
			},
			// 生成海报
			PosterCanvas: function(arrImages, storeName, price, successFn) {
				console.log(arrImages)
				let context = uni.createCanvasContext('firstCanvas')
				context.clearRect(0, 0, 0, 0);
				let that = this;
				uni.getImageInfo({
					src: arrImages[0],
					success: function(image) {
						context.drawImage(arrImages[0], 0, 0, 750, 1190);
						// #ifdef H5
						context.drawImage(arrImages[1], 0, 0, 750, 750);
						context.save();
						context.drawImage(arrImages[2], 110, 1000, 140, 140);
						// #endif
						// #ifdef MP-WEIXIN
						var fsm = wx.getFileSystemManager();
						var filePath = wx.env.USER_DATA_PATH + '/share_img' + (new Date()).valueOf() +
							'.png';
						var buffer = wx.base64ToArrayBuffer(arrImages[1].substring(22, arrImages[1]
							.length)); // 将商品图片转ArrayBuffer 对象
						var fsm1 = wx.getFileSystemManager();
						var filePath1 = wx.env.USER_DATA_PATH + '/share_code_img' + (new Date())
						.valueOf() + '.png';
						var buffer1 = wx.base64ToArrayBuffer(arrImages[2].substring(22, arrImages[2]
							.length)); // 将二维码转ArrayBuffer 对象
						fsm.writeFile({
							filePath: filePath, // 要写入的文件路径 (本地路径)
							data: buffer, // 要写入的文本或二进制数据
							encoding: "base64", // 指定写入文件的字符编码
							success(res) {
								context.drawImage(filePath, 0, 0, 750, 750);
								context.save();
								fsm1.writeFile({
									filePath: filePath1, // 要写入的文件路径 (本地路径)
									data: buffer1, // 要写入的文本或二进制数据
									encoding: "base64", // 指定写入文件的字符编码
									success(res) {
										context.drawImage(filePath1, 100, 1000, 140, 140);
									}
								});
							}
						});
						// #endif

						context.restore();
						context.setFontSize(30);
						context.setTextAlign('center');
						let maxText = 28;
						let text = storeName;
						let topText = '';
						let bottomText = '';
						let len = text.length;
						if (len > maxText * 2) {
							text = text.slice(0, maxText * 2 - 4) + '......';
							topText = text.slice(0, maxText - 1);
							bottomText = text.slice(maxText - 1, len);
						} else {
							if (len > maxText) {
								topText = text.slice(0, maxText - 1);
								bottomText = text.slice(maxText - 1, len);
							} else {
								topText = text;
								bottomText = '';
							}
						}
						context.fillText(topText, 750 / 2, 800);
						context.fillText(bottomText, 750 / 2, 840);
						context.setFontSize(37);
						context.setTextAlign('center');
						context.setFillStyle('#fc4141');
						context.fillText(that.$util.ipMoney(price).type + that.$util.ipMoney(price).num,
							750 / 2, 900);
						setTimeout(function() {
							context.draw(true, function() {
								uni.canvasToTempFilePath({
									destWidth: 750,
									destHeight: 1190,
									canvasId: 'firstCanvas',
									fileType: 'jpg',
									success: function(res) {
										// 在H5平台下，tempFilePath 为 base64
										uni.hideLoading();
										successFn && successFn(res
											.tempFilePath);
										// that.imagePath = res.tempFilePath;
										// that.canvasStatus = true;
									}
								})
							})
						}, 500)
					},
					fail: function(err) {
						uni.hideLoading();
						that.$util.Tips({
							title: '无法获取图片信息'
						});
					}
				});
			},
			// 分享海报关闭
			listenerActionClose: function() {
				this.canvasStatus = false;
				this.canvasContext = false
			},
			//隐藏海报
			posterImageClose: function() {
				this.canvasStatus = false
				this.canvasContext = false
			},
			// 保存到手机相册
			// #ifdef MP
			savePosterPath: function() {
				let that = this;
				uni.getSetting({
					success(res) {
						if (!res.authSetting['scope.writePhotosAlbum']) {
							uni.authorize({
								scope: 'scope.writePhotosAlbum',
								success() {
									uni.saveImageToPhotosAlbum({
										filePath: that.imagePath,
										success: function(res) {
											that.posterImageClose();
											that.$util.Tips({
												title: '保存成功',
												icon: 'success'
											});
										},
										fail: function(res) {
											that.$util.Tips({
												title: '保存失败'
											});
										}
									})
								}
							})
						} else {
							uni.saveImageToPhotosAlbum({
								filePath: that.imagePath,
								success: function(res) {
									that.posterImageClose();
									that.$util.Tips({
										title: '保存成功',
										icon: 'success'
									});
								},
								fail: function(res) {
									that.$util.Tips({
										title: '保存失败'
									});
								},
							})
						}
					}
				})
			},
			// #endif
			showWxFun() {
				this.showWxService = true
				console.info(this.showWxService)
			},
			cartAttrFun(e){
				this.cartAttr = e
			},
			operation(str){
				if(!str){
					return
				}
				var val=str.slice(0,str.length-1)
				return Number(val)
			},
			// 收藏商品
			setCollect: function() {
				let that = this;
				if (that.isLogin === false) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
				} else {
					if (that.storeInfo.userCollect) {
						collectDel(that.storeInfo.id).then(res => {
							that.$set(that.storeInfo, 'userCollect', !that.storeInfo.userCollect);
						})
					} else {
						collectAdd(that.storeInfo.id).then(res => {
							that.$set(that.storeInfo, 'userCollect', !that.storeInfo.userCollect);
						})
					}
				}
			},
		},
		// 用户点击右上角分享
		// #ifdef MP
		onShareAppMessage: function() {
			let that = this;
			console.log('/pages/goods_details/index?id=' + that.id + '&spid=' + (this.uid ? this.uid : 0), "分享地址")
			return {
				title: that.storeInfo.storeName || '',
				imageUrl: that.storeInfo.image || '',
				path: '/pages/goods_details/index?id=' + that.id + '&spid=' + (this.uid ? this.uid : 0)
			}
		}
		// #endif
	}
</script>

<style scoped lang="scss">
	.product-con {
		width: 750rpx;
		overflow: hidden;
		.navbar {
			position: fixed;
			background-color: #fff;
			top: 0;
			left: 0;
			z-index: 99;
			width: 100%;

			.navbarH {
				position: relative;
				.navbarCon {
					position: absolute;
					bottom: 0;
					height: 100rpx;
					width: 100%;

					.header {
						height: 96rpx;
						font-size: 30rpx;
						color: #050505;
						background-color: #fff;
						/* #ifdef MP */
						padding-right: 95rpx;

						/* #endif */
						.item {
							position: relative;
							margin: 0 25rpx;
						}

						.item.on:before {
							position: absolute;
							width: 60rpx;
							height: 5rpx;
							background-repeat: no-repeat;
							content: "";
							background-color: #222;
							bottom: -10rpx;
							left: 50%;
							margin-left: -28rpx;
						}
					}
				}
			}
		}

		.iconfanhui {
			color: #000;
			position: fixed;
			font-size: 36rpx;
			width: 100rpx;
			height: 56rpx;
			line-height: 54rpx;
			z-index: 1000;
			left: 33rpx;
			/* #ifdef H5 */
			top: 20rpx !important;
			/* #endif */
		}
		.wrapper .share{
			// margin-top: 132rpx;
		}
		.wrapper .share .titWarp {
			width: 580rpx;

			.h1 {
				font-size: 32rpx;
				font-weight: 600;
				color: #222222;
				line-height: 45rpx;
			}

			.h2 {
				font-size: 26rpx;
				font-weight: 400;
				color: #222222;
				line-height: 37rpx;
				margin-top: 7rpx;
			}
		}

		.wrapper .moneyWarp {
			overflow: hidden;
			margin: 40rpx 30rpx 20rpx 30rpx;
			padding-bottom: 30rpx;

			.h1Warp {
				display: flex;
				align-items: center;

				.h1 {
					font-size: 40rpx;
					font-weight: 600;
					color: #222222;
					line-height: 56rpx;
					vertical-align: middle;
				}

				.taxPrice {
					font-size: 24rpx;
					color: #5a5a5a;
					margin-left: 6rpx;

					.t1 {
						margin-left: 6rpx;
						font-size: 22rpx;
					}
				}

				.fahuoLabel {
					display: inline-block;
					font-size: 20rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					// color: #AF8A40;
					line-height: 24rpx;
					padding: 4rpx 11rpx;
					border-radius: 2rpx;
					// border: 1px solid #AF8A40;
					// margin-left: 20rpx;
					vertical-align: middle;

					.shipadd {
						width: 20rpx;
						height: 20rpx;
						vertical-align: middle;
						margin-right: 6rpx;
					}

					text {
						vertical-align: middle;
					}
				}

				.deliveryTime {
					margin-left: 6rpx;
					font-size: 20rpx;
					color: #5a5a5a;
				}
			}

			.specsList {
				display: flex;

				.specsItem {
					border: 1px solid #bbb;
					font-size: 26rpx;
					color: #282828;
					padding: 7rpx 33rpx;
					border-radius: 6rpx;
					margin: 14rpx 0 0 14rpx;
				}

				.specsItem.on {
					color: #fff;
					background-color: #222222;
					border-color: #222222;
				}
			}

			.h2 {
				.discount {
					font-size: 24rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #4C360B;
					line-height: 33rpx;
					padding: 2rpx 8rpx;
					background: #E9D5AC;
					border-radius: 2rpx;
					margin-right: 20rpx;
				}

				.ouyuan {
					font-size: 26rpx;
					font-family: Tahoma;
					color: #666666;
					line-height: 31rpx;
				}
			}
		}

		.attribute,
		.product-con .userEvaluation .title {
			font-size: 28rpx;
			font-weight: 500;
			color: #222222;
		}

		.generate-posters {
			width: 100%;
			height: 170rpx;
			background-color: #fff;
			position: fixed;
			left: 0;
			bottom: 0;
			z-index: 388;
			transform: translate3d(0, 100%, 0);
			transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
			border-top: 1rpx solid #eee;

			.item {
				flex: 50%;
				text-align: center;
				font-size: 30rpx;

				.iconfont {
					font-size: 80rpx;
					color: #5eae72;
				}

				.iconfont.icon-haibao {
					color: #5391f1;
				}
			}
		}

		.generate-posters.on {
			transform: translate3d(0, 0, 0);
		}

		.poster-pop {
			position: fixed;
			width: 450rpx;
			height: 714rpx;
			top: 50%;
			left: 50%;
			transform: translateX(-50%);
			margin-top: -432rpx;
			z-index: 399;

			image {
				width: 100%;
				height: 100%;
				display: block;
			}

			.close {
				width: 46rpx;
				height: 75rpx;
				position: fixed;
				right: 0;
				top: -73rpx;
				display: block;
			}

			.save-poster {
				background-color: #222;
				font-size: ：22rpx;
				color: #fff;
				text-align: center;
				height: 76rpx;
				line-height: 76rpx;
				width: 100%;
			}

			.keep {
				color: #fff;
				text-align: center;
				font-size: 25rpx;
				margin-top: 10rpx;
			}
		}
	}

	.wx_card {
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 9999;
		background-color: rgba(0, 0, 0, 0.3);

		.wx_code {
			width: 568rpx;
			background-color: #FFFFFF;
			border-radius: 4rpx;
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			box-shadow: 0 10px 20px 0 rgba(4, 0, 0, .1);
			text-align: center;

			.iconguanbi1 {
				color: rgba(34, 34, 34, 1);
				font-size: 24rpx;
				position: absolute;
				top: 0rpx;
				right: 0rpx;
				padding: 24rpx;
			}

			.code_er {
				padding-top: 83rpx;

				image {
					width: 300rpx;
					height: 300rpx;
				}
			}

			.add_tips {
				padding: 40rpx 0 60rpx;
				font-size: 26rpx;
				color: rgba(34, 34, 34, 1);
			}
		}
	}

	.goodsInfo-row {
		margin-bottom: 20rpx;
		font-size: 24rpx;

		.bg-purple {
			color: #808080;
		}
	}

	.productWinList {
		max-height: 395rpx;
		overflow: auto;
		margin-top: 20rpx;
	}

	.productWinList .item~.item {
		margin-top: 26rpx;
	}

	.productWinList .item .title {
		font-size: 26rpx;
		color: #999;
	}

	.productWinList .item .listn .itemn {
		font-size: 22rpx;
		color: #bbb;
		background-color: #FBFBFB;
		padding: 7rpx 33rpx;
		border-radius: 6rpx;
		margin: 14rpx 0 0 14rpx;
	}

	.productWinList .item .listn .itemn.on {
		color: #fff;
		background-color: #222;
		border-color: #222;
	}
	.product-intro .conter{
		background-color: #FFFFFF;
		padding: 0 30rpx;
	}
	.buyButton{
		border: 2rpx solid #222222;
		background-color: #323334;
		color: #ffffff;
		font-size: 30rpx;
		padding:8rpx 10rpx;
	}
	.l-content{
		display: flex;
		justify-content: space-between;
		align-items: center;
		.content-left{
			width: 520rpx;
		}
	}
</style>
